<!DOCTYPE html>

<html lang="en">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="description" content="zDashboard - Awesome Dashboard">
	<meta name="author" content="Zul Azman">
	
	<link rel="shortcut icon" type="image/ico" href="img/favicon.png">
	<link rel="apple-touch-icon" href="#">
	<link rel="apple-touch-icon" sizes="144x144" href="#">
	<link rel="apple-touch-icon" sizes="114x114" href="#">

	<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css" media="screen">
	<link rel="stylesheet" type="text/css" href="css/font-awesome/css/font-awesome.min.css" media="screen">
	<link rel="stylesheet" type="text/css" href="css/bootstrap-datetimepicker.min.css" media="screen">
	<link rel="stylesheet" type="text/css" href="js/lib/lightbox/ekko-lightbox.min.css" media="screen">
	<link rel="stylesheet" type="text/css" href="css/style.css" media="screen">
	<link rel="stylesheet" type="text/css" href="css/frontend.css" media="screen">

	<!--[if lt IE 9]>
		<script src="js/html5shiv.js" type="text/javascript"></script>
	<![endif]-->
	
	<!-- Utilities JS -->
	<script src="js/jquery.min.js"></script>
  	<script>window.jQuery || document.write('<script src="js/library/jquery/jquery.min.js">\x3C/script>')</script>

	<title>zDashboard - Simplest Awesome Dashboard</title>

</head>

<body>
<div id="wrap">

<section class="navbar-fixed-top">
<section id="header" class="center-header">
	<div class="container-fluid">
		<div class="row">
			<nav class="navbar navbar-default" role="navigation">
				<div class="container-fluid">

					<div class="row">

						<div class="col-md-4 col-sm-4 hidden-xs">
							<form class="navbar-form navbar-left" role="search">
								<div class="input-group">
									<input type="text" class="form-control" placeholder="Search">
									<span class="input-group-btn">
										<button class="btn btn-default" type="button">
											<i class="fa fa-search"></i>
										</button>
									</span>
								</div><!-- /input-group -->
							</form>
						</div>

						<div class="col-md-4 col-sm-4">
							<div class="navbar-header">
								<span class="sr-only">Toggle navigation</span>
								<button type="button" class="navbar-toggle navbar-toggle-left" data-toggle="collapse" data-target="#menu-bar">
									<i class="fa fa-th"></i>
								</button>
								<a class="navbar-brand" href="#">
									<h1>zDashboard</h1>
								</a>
								<button type="button" class="navbar-toggle navbar-toggle-right" data-toggle="collapse" data-target="#user-bar">
									<i class="fa fa-user"></i>
								</button>
							</div>
						</div>
						
						<div class="col-md-4 col-sm-4">
							<div class="collapse navbar-collapse" id="user-bar">
								<ul class="nav navbar-nav navbar-right">
									<li class="dropdown notification">
										<a href="#" class="dropdown-toggle" data-toggle="dropdown">
											<i class="fa fa-globe"></i>
											<span class="label label-alt-green label-notice">10</span>
										</a>
										<ul class="dropdown-menu">
											<li><a href="#">Action</a></li>
											<li><a href="#">Another action</a></li>
											<li><a href="#">Something else here</a></li>
											<li class="divider"></li>
											<li><a href="#">Separated link</a></li>
											<li class="divider"></li>
											<li><a href="#">One more separated link</a></li>
										</ul>
									</li>

									<li class="dropdown inbox-notification">
										<a href="#" class="dropdown-toggle" data-toggle="dropdown">
											<i class="fa fa-inbox"></i>
											<span class="label label-alt-green label-notice">3</span>
										</a>
										<ul class="dropdown-menu">
											<li><a href="#">Action</a></li>
											<li><a href="#">Another action</a></li>
											<li><a href="#">Something else here</a></li>
											<li class="divider"></li>
											<li><a href="#">Separated link</a></li>
											<li class="divider"></li>
											<li><a href="#">One more separated link</a></li>
										</ul>
									</li>

									<li class="dropdown user-info">
										<a href="#" class="dropdown-toggle" data-toggle="dropdown"> 
											<span class="thumb-md avatar pull-left"> 
												<img src="img/sample/sample-avatar.jpg" class="img-circle">
											</span> 
											<span class="hidden-sm">Joe Armand</span>
											<b class="caret"></b>
										</a>
										<ul class="dropdown-menu">
											<li><a href="#">Action</a></li>
											<li><a href="#">Another action</a></li>
											<li><a href="#">Something else here</a></li>
											<li class="divider"></li>
											<li><a href="#">Separated link</a></li>
										</ul>
									</li>
								</ul>
							</div>

						</div>

					</div>

				</div>
			</nav>
		</div>
	</div>
</section>
<div class="collapse navbar-collapse" id="menu-bar">
	<section id="nav" class="navigation">
		<div class="container-fluid">
			<div class="row">

				<div class="col-md-4 hidden-sm hidden-xs">
					
<ol class="breadcrumb bc-nav">
  <li><a href="#"><i class="fa fa-home"></i></a></li>
  <li><a href="#">zDashboard</a></li>
  <li class="active">Inbox</li>
</ol>
				</div>

				<div class="col-md-8">
					<nav>
						<ul class="nav navbar-nav nav-pills nav-center navbar-right">
							<li>
								<a href="index.html">
									<i class="fa fa-tachometer"></i>
									Overview
								</a>
							</li>
							<li>
								<a href="task.html">
									<i class="fa fa-tasks"></i>
									Tasks
								</a>
							</li>
							<li class="current active">
								<a class='current' href="inbox.html">
									<i class="fa fa-inbox"></i>
									Inbox
								</a>
							</li>
							<li class="dropdown">
								<a href="#" class="dropdown-toggle" data-toggle="dropdown">
									<i class="fa fa-file-text-o"></i>
									Pages <b class="caret"></b>
								</a>
								<ul class="dropdown-menu">
									<li role="presentation" class="dropdown-header">Overview</li>
									<li><a href="index.html">Option 1</a></li>
									<li><a href="index-two.html">Option 2</a></li>
									<li class="divider"></li>
									<li role="presentation" class="dropdown-header">Task</li>
									<li><a href="task.html">My Tasks</a></li>
									<li><a href="task-today.html">Today</a></li>
									<li><a href="task-milestone.html">Milestone</a></li>
									<li class="divider"></li>
									<li role="presentation" class="dropdown-header">Milestone</li>
									<li><a href="task-milestone.html">Overview</a></li>
									<li><a href="task-milestone-single.html">Milestone Single Page</a></li>
									<li class="divider"></li>
									<li role="presentation" class="dropdown-header">Project</li>
									<li><a href="project.html">Overview</a></li>
									<li><a href="project-task.html">Tasks</a></li>
									<li><a href="project-assets.html">Assets</a></li>
								</ul>
							</li>
							<li class="dropdown">
								<a href="components.html" class="dropdown-toggle" data-toggle="dropdown">
									<i class="fa fa-asterisk"></i>
									Components <b class="caret"></b>
								</a>
								<ul class="dropdown-menu">
									<li><a href="typography.html">Typography</a></li>
									<li><a href="elements.html">Elements</a></li>
								</ul>
							</li>
							<li>
								<a href="profile.html">
									<i class="fa fa-user"></i>
									Profile
								</a>
							</li>
						</ul>
					</nav>
				</div>

			</div>
		</div>
	</section>
</div>
</section>

<style>
	
	
</style>

<section id="content" class="two-col-content inbox-content">
	<div class="container-fluid">
		<div class="row row-offcanvas row-offcanvas-left row-offcanvas-sm row-offcanvas-sm-left row-offcanvas-xs">
			<div class="col-sm-3 col-md-2 sidebar sidebar-offcanvas sidebar-offcanvas-sm">
				<ul class="nav nav-sidebar">
					<li>
						<a class="itm_1" href="#"><i class="fa fa-envelope"></i> Messages <span class="badge">4</span></a>
					</li>
					<li class="hassubmenu">
						<a class="itm_1" href="javascript:void(0)"><i class="fa fa-chevron-circle-down"></i><i class="fa fa-chevron-circle-right"></i> 一级菜单 A</a>
						<div class="nav_subs nav_sub_2">
							<a href="#" class="itm_2">二级菜单 A</a>
							<a href="#" class="itm_2 subactive">二级菜单 B</a>
						</div>
					</li>
					<li>
						<a class="itm_1" href="#"><i class="fa fa-trash"></i> Trash</a>
					</li>
					<li class="hassubmenu">
						<!--注意，凡是拥有hassubmenu的菜单内部的角标"fa-chevron-circle"是成对出现，如下所示-->
						<a class="itm_1" href="javascript:void(0)"><i class="fa fa-chevron-circle-down"></i><i class="fa fa-chevron-circle-right"></i> 一级菜单 A</a>
						<div class="nav_subs nav_sub_2">
							<a href="#" class="itm_2">二级菜单 A</a>
							<a href="#" class="itm_2 subactive">二级菜单 B</a>
						</div>
					
					</li>
				</ul>

				<ul class="nav nav-sidebar">
					<li class="nav-title row no-margin">
						<div class="col-md-9">
							<h4>Labels</h4>
						</div>
						<div class="col-md-3">
							<a href="#" class="no-padding">
								<i class="fa fa-plus"></i>
							</a>
						</div>
					</li>
					<li>
						<a href="#"><span class="indicator-label bg-primary"></span> Primary Label</a>
					</li>
					<li>
						<a href="#"><span class="indicator-label bg-info"></span> Info Label</a>
					</li>
					<li>
						<a href="#"><span class="indicator-label bg-warning"></span> Warning Label</a>
					</li>
					<li>
						<a href="#"><span class="indicator-label bg-danger"></span> Danger Label</a>
					</li>
				</ul>
			</div>
		
			<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
				<div class="inner no-pad-t">

					<div class="page-header-container row">
						<div class="col-md-12 clearfix">

							<ul class="header-action task-action list-inline pull-left">
								<li class="hidden-sm hidden-md hidden-lg">
									<button type="button" class="btn btn-white btn-icon hidden-sm hidden-md hidden-lg" data-toggle="offcanvas-sm">
										<i class="fa fa-bars m-right"></i> Menu
									</button>
								</li>
								<li>
									<a href="#" class="btn btn-success" data-toggle="modal" data-target="#modal-new-message"><i class="fa fa-plus-circle m-right"></i> New Message</a>
								</li>
							</ul>
							<ul class="header-action task-action list-inline hidden-xs pull-right">
								<li class="inbox-item-action">
									<div class="btn-group" role="group" aria-label="...">
										<div class="btn-group">
											<a href="#" class="btn btn-white dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
												Mark <span class="caret"></span>
											</a>
											<ul class="dropdown-menu dropdown-menu-right" role="menu">
												<li><a href="#">Mark as Read</a></li>
												<li><a href="#">Mark as Unread</a></li>
												<li><a href="#">Mark as Flag</a></li>
											</ul>
										</div>
										<div class="btn-group">
											<a href="#" class="btn btn-white">
												<i class="fa fa-trash"></i> Trash
											</a>
										</div>
										<div class="btn-group">
											<a href="#" class="btn btn-white">
												<i class="fa fa-archive"></i> Archive
											</a>
										</div>
									</div>
								</li>
								<li class="inbox-item-search">
									<div class="input-group">
										<input type="text" class="form-control">
										<span class="input-group-btn">
											<button class="btn btn-white" type="button"><i class="fa fa-search"></i></button>
										</span>
									</div>
								</li>
								<li class="inbox-item-pagination">
									<nav>
										<ul class="pagination">
											<li class="disabled">
												<a href="#" aria-label="Previous">
													<span aria-hidden="true">&laquo;</span>
												</a>
											</li>
											<li><span>Page 1 of 89</a></span>
											<li>
												<a href="#" aria-label="Next">
													<span aria-hidden="true">&raquo;</span>
												</a>
											</li>
										</ul>
									</nav>
								</li>
							</ul>
						</div>
					</div>

					<section class="group-panel">
	<div class="row">
		<div class="col-md-12">
			<div class="panel panel-default panel-column panel-inbox no-margin">
				<div class="row no-margin">
					<div class="col-md-5 col-sm-3 col-xs-2 panel-sidebar">
						<ul class="media-list no-margin">
							<li class="media unread">
								<div class="col-md-1 col-sm-1 no-padding">
									<div class="checkbox">
										<label>
											<input type="checkbox">
										</label>
									</div>
								</div>
								<div class="col-md-11 col-sm-11 no-padding">
									<a href="#" class="clearfix">
										<div class="media-left">
											<img class="media-object img-circle" src="img/uif-1.jpg" alt="...">
										</div>
										<div class="media-body hidden-xs">
											<h4 class="media-heading">John Appleseed</h4>
											<span class="meta-time">2 hours ago</span>
											<p>This is the sample of single message</p>
											<span class="indicator-label bg-warning"></span>
										</div>
									</a>
								</div>
							</li>

							<li class="media unread active">
								<div class="col-md-1 col-sm-1 no-padding">
									<div class="checkbox">
										<label>
											<input type="checkbox">
										</label>
									</div>
								</div>
								<div class="col-md-11 col-sm-11 no-padding">
									<a href="#" class="clearfix">
										<div class="media-left">
											<img class="media-object img-circle" src="img/uif-2.jpg" alt="...">
										</div>
										<div class="media-body hidden-xs">
											<h4 class="media-heading">Steve Stevy</h4>
											<span class="meta-time">6 hours ago</span>
											<p>This is the sample of single message</p>
											<span class="indicator-label bg-warning"></span>
										</div>
									</a>
								</div>
							</li>

							<li class="media unread">
								<div class="col-md-1 col-sm-1 no-padding">
									<div class="checkbox">
										<label>
											<input type="checkbox">
										</label>
									</div>
								</div>
								<div class="col-md-11 col-sm-11 no-padding">
									<a href="#" class="clearfix">
										<div class="media-left">
											<img class="media-object img-circle" src="img/uif-3.jpg" alt="...">
										</div>
										<div class="media-body hidden-xs">
											<h4 class="media-heading">Justin Power</h4>
											<span class="meta-time">8 hours ago</span>
											<p>This is the sample of single message</p>
										</div>
									</a>
								</div>
							</li>

							<li class="media unread">
								<div class="col-md-1 col-sm-1 no-padding">
									<div class="checkbox">
										<label>
											<input type="checkbox">
										</label>
									</div>
								</div>
								<div class="col-md-11 col-sm-11 no-padding">
									<a href="#" class="clearfix">
										<div class="media-left">
											<img class="media-object img-circle" src="img/uif-4.jpg" alt="...">
										</div>
										<div class="media-body hidden-xs">
											<h4 class="media-heading">Leon Lee</h4>
											<span class="meta-time">10 hours ago</span>
											<p>This is the sample of single message</p>
											<span class="indicator-label bg-primary"></span>
										</div>
									</a>
								</div>
							</li>

							<li class="media">
								<div class="col-md-1 col-sm-1 no-padding">
									<div class="checkbox">
										<label>
											<input type="checkbox">
										</label>
									</div>
								</div>
								<div class="col-md-11 col-sm-11 no-padding">
									<a href="#" class="clearfix">
										<div class="media-left">
											<img class="media-object img-circle" src="img/uif-5.jpg" alt="...">
										</div>
										<div class="media-body hidden-xs">
											<h4 class="media-heading">David John</h4>
											<span class="meta-time">Yesterday</span>
											<p>This is the sample of single message</p>
											<span class="indicator-label bg-primary"></span>
										</div>
									</a>
								</div>
							</li>

							<li class="media">
								<div class="col-md-1 col-sm-1 no-padding">
									<div class="checkbox">
										<label>
											<input type="checkbox">
										</label>
									</div>
								</div>
								<div class="col-md-11 col-sm-11 no-padding">
									<a href="#" class="clearfix">
										<div class="media-left">
											<img class="media-object img-circle" src="img/uif-6.jpg" alt="...">
										</div>
										<div class="media-body hidden-xs">
											<h4 class="media-heading">Joey Joe</h4>
											<span class="meta-time">24/2/2015</span>
											<p>This is the sample of single message</p>
											<span class="indicator-label bg-primary"></span>
										</div>
									</a>
								</div>
							</li>
						</ul>
					</div>
					<div class="col-md-7 col-md-offset-5 col-sm-9 col-sm-offset-3 col-xs-offset-2 panel-content">
						<div class="inner">
							<div class="media-header">
								<div class="row">
									<div class="col-md-8 col-sm-9 col-xs-9 media-header-meta">
										<span class="text-title">Conversation with</span> 
										<ul class="list-inline no-margin">
											<li>
												<h4>
													<a href="#">Steve Stevy</a>
												</h4>
											</li>
											<li>
												24 Feb 2015, 6.03 am
											</li>
											<li>
												<a href="#" class="ttip" data-toggle="tooltip" data-placement="top" title="2 Attachments">
													<i class="fa fa-paperclip"></i>
												</a>
											</li>
										</ul>
									</div>
									<div class="col-md-4 col-sm-3 col-xs-3 media-header-action">
										<div class="btn-group pull-right">
											<button type="button" class="btn btn-white dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
												<i class="fa fa-cog"></i> <span class="caret"></span>
											</button>
											<ul class="dropdown-menu dropdown-menu-right" role="menu">
												<li><a href="#">Action</a></li>
												<li><a href="#">Another action</a></li>
												<li><a href="#">Something else here</a></li>
												<li class="divider"></li>
												<li><a href="#">Separated link</a></li>
											</ul>
										</div>
									</div>
								</div>
							</div>
							<div class="message-body">
								<p>Cupcake ipsum dolor sit amet marshmallow chocolate cake. Tiramisu pie donut sweet roll marzipan dessert dessert. Gummi bears halvah cookie muffin candy cake. Chocolate cake biscuit carrot cake macaroon dessert muffin marzipan gummi bears. Lollipop dragée liquorice sweet roll cupcake. Dragée lemon drops muffin powder muffin chocolate marshmallow. Chocolate cupcake pastry. Liquorice tart icing jelly apple pie candy canes.</p>
								<p>Croissant sugar plum sweet roll. Apple pie brownie pie brownie danish jelly gummies. Pie tootsie roll muffin chocolate cake pie caramels cotton candy toffee. Cheesecake bear claw cotton candy pudding. Gummies chocolate bar topping bear claw cotton candy dessert muffin. Chocolate cake bonbon jelly croissant fruitcake jelly-o jelly beans.</p>
								<div id="reply" class="reply">
									<form class="text-right">
										<textarea class="form-control" row="5"></textarea>
										<button type="submit" class="btn btn-green">Reply</button>
									</form>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>

				</div>

			</div>

		</div>
	</div>

</section>

<section id="footer">
	<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 footer">
		<div class="container-fluid">
			<div class="row">
				<div class="col-md-6  col-sm-6 col-xs-12">
					<div class="copy">
						&copy; <a href="#">zDashboard</a> 2015
					</div>
				</div>
				<div class="col-md-6  col-sm-6 col-xs-12">
					<div class="pull-right footer-nav">
						<ul class="nav nav-pills">
							<li>
								<a href="#">Terms &amp; Conditions</a>
							</li>
							<li>
								<a href="#">Contact</a>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>

</div>


<!-- Modal -->
<div class="modal fade modal-add-task modal-item" id="modal-add-task" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
				<h4 class="modal-title" id="myModalLabel">Add new Task</h4>
			</div>

			<div class="modal-body">
				<form class="form-horizontal form-simple" role="form">
					<div class="form-group task-title">
						<div class="col-sm-1">
							<div class="task-check">
								<div class="checkbox">
									<label>
										<input type="checkbox">
									</label>
								</div>
							</div>
						</div>
						<div class="col-sm-11">
							<textarea rows="1" class="form-control autosize animated" placeholder="Type your task here"></textarea>
						</div>
					</div>

					<div class="form-group">
						<div class="col-sm-2">
							<label class="control-label">Due Date</label>
						</div>
						<div class="col-sm-10">
							<input type='text' class="form-control" id='dtp-due' placeholder="Pick a date and time" >
						</div>
					</div>

					<div class="form-group">
						<div class="col-sm-2">
							<label class="control-label">Assign to</label>
						</div>
						<div class="col-sm-10 select-container">
							<select id="select-assignee" class="select-assignee" placeholder="Select a person...">
								<option value="">Select a person...</option>
								<option value="4">Thomas Wall</option>
								<option value="1">Nic Paint</option>
								<option value="3">Anne Pink</option>
								<option value="5">Arnold Draint</option>
							</select>
						</div>
					</div>

					<div class="form-group">
						<div class="col-sm-2">
							<label class="control-label">Followers</label>
						</div>
						<div class="col-sm-10">
							<input type="text" id="input-follower" class="light-tags input-follower" value="Thomal Wall, Nic Paint, Anne Pink">
						</div>
					</div>

					<div class="form-group">
						<div class="col-sm-2">
							<label class="control-label">Tags</label>
						</div>
						<div class="col-sm-10">
							<input type="text" id="input-tags" value="sample tags, neat eh?">
						</div>
					</div>
				</form>
			</div>
			
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
				<button type="button" class="btn btn-success">Save changes</button>
			</div>
		</div>
	</div>
</div>


<!-- Modal -->
<div class="modal fade modal-add-milestone modal-item" id="modal-add-milestone" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
				<h4 class="modal-title" id="myModalLabel">Add new Milestone</h4>
			</div>

			<div class="modal-body">
				<form class="form-horizontal form-simple" role="form">
					<div class="form-group milestone-title">
						<div class="col-sm-2">
							<label class="control-label">Title</label>
						</div>
						<div class="col-sm-10">
							<input type='text' class="form-control" placeholder="eg: Version 0.3" >
						</div>
					</div>

					<div class="form-group">
						<div class="col-sm-2">
							<label class="control-label">Due Date</label>
						</div>
						<div class="col-sm-10">
							<input type='text' class="form-control" id='dtp-due-milestone' placeholder="Pick a date and time" >
						</div>
					</div>

				</form>
			</div>
			
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
				<button type="button" class="btn btn-success">Save changes</button>
			</div>
		</div>
	</div>
</div>


<!-- Modal -->
<div class="modal fade modal-edit-task modal-item" id="modal-edit-task" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
				<h4 class="modal-title" id="myModalLabel">Edit Task</h4>
			</div>

			<div class="modal-body">
				<form class="form-horizontal form-simple" role="form">
					<div class="form-group task-title">
						<div class="col-sm-1">
							<div class="task-check">
								<div class="checkbox">
									<label>
										<input type="checkbox">
									</label>
								</div>
							</div>
						</div>
						<div class="col-sm-11">
							<textarea rows="2" class="form-control autosize animated">Pudding pudding oat cake. Candy oat cake pastry sesame snaps tiramisu pastry.</textarea>
						</div>
					</div>

					<div class="form-group">
						<div class="col-sm-2">
							<label class="control-label">Due Date</label>
						</div>
						<div class="col-sm-10">
							<input type='text' class="form-control" id='dtp-edit' placeholder="Pick a date and time" value="" >
						</div>
					</div>

					<div class="form-group">
						<div class="col-sm-2">
							<label class="control-label">Assign to</label>
						</div>
						<div class="col-sm-10 select-container">
							<select id="select-assignee-edit" class="select-assignee" placeholder="">
								<option value="2">Thomas Wall</option>
								<option value="1">Nic Paint</option>
								<option value="3">Anne Pink</option>
								<option value="5">Arnold Draint</option>
							</select>
						</div>
					</div>

					<div class="form-group">
						<div class="col-sm-2">
							<label class="control-label">Followers</label>
						</div>
						<div class="col-sm-10">
							<input type="text" id="input-follower-edit" class="light-tags input-follower-edit" value="Thomal Wall, Nic Paint, Anne Pink">
						</div>
					</div>

					<div class="form-group">
						<div class="col-sm-2">
							<label class="control-label">Tags</label>
						</div>
						<div class="col-sm-10">
							<input type="text" id="input-tags-edit" value="sample tags, neat eh?">
						</div>
					</div>
				</form>
			</div>
			
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
				<button type="button" class="btn btn-success">Save changes</button>
			</div>
		</div>
	</div>
</div>


<!-- Modal -->
<div class="modal fade modal-add-task modal-item" id="modal-new-message" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
				<h4 class="modal-title" id="myModalLabel">New Message</h4>
			</div>

			<div class="modal-body">
				<form class="form-horizontal form-simple" role="form">
					<div class="form-group">
						<div class="col-sm-2">
							<label class="control-label">Send to</label>
						</div>
						<div class="col-sm-10">
							<input type="text" id="select-to" placeholder="Select User">
						</div>
					</div>

					<div class="form-group inbox-message">
						<div class="col-sm-2">
							<label class="control-label">Message</label>
						</div>
						<div class="col-sm-10">
							<textarea rows="5" class="form-control autosize animated" placeholder="Write your message here"></textarea>
						</div>
					</div>

				</form>
			</div>
			
			<div class="modal-footer">				
				<button type="button" class="btn btn-success">Send</button>
			</div>
		</div>
	</div>
</div>


<!-- Utilities JS -->
	<script src="js/jquery.min.js"></script>
  	<script>window.jQuery || document.write('<script src="js/library/jquery/jquery.min.js">\x3C/script>')</script>
	<script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
	<script src="js/modernizr-latest.js" type="text/javascript"></script>

<!-- Lib -->

	<!-- Boostrap Hover Dropdown -->
	<script src="js/lib/bootstrap-hover-dropdown.js" type="text/javascript"></script>

	<!-- Bootstrap Checkbox -->
	<!-- 删除理由，本系统不经常使用bootstrap-checkbox -->
	<script src="js/lib/bootstrap-checkbox.js" type="text/javascript"></script>

	<!-- Selectize -->
	<script src="js/lib/selectize/selectize.js" type="text/javascript"></script>

	<!-- Autosize -->
	<script src="js/lib/jquery.autosize.js" type="text/javascript"></script>
	
	<!-- WYSIHTML5 -->
	
	<!-- Bootstrap Datepicker -->
	<script src="js/lib/moment.js" type="text/javascript"></script>
	<script src="js/lib/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js" type="text/javascript"></script>
	
	<!-- Calendar -->
	<script src="js/lib/bootstrap-calendar/bootstrap_calendar.js"></script>

	<!-- LightBox -->
	<script src="js/lib/lightbox/ekko-lightbox.min.js"></script>
	
<!-- Theme JS -->
	<script src="js/custom.calendar.js" type="text/javascript"></script>
	<script src="js/custom.style.js" type="text/javascript"></script>
	
	
	<!--TEAM DEVELOP JS-->
	<script src="js/global.js"></script>
	
</body>

</html>